import React, { Component } from 'react';
import {
    Platform,
    StyleSheet,
    Text,
    View,
    Dimensions

} from 'react-native';
import WkWebView               from 'react-native-wkwebview-reborn';
import BaseNavigationBar       from '../../views/BaseNavigationBar';
const {width,height} = Dimensions.get('window');


export default class WKWebViewScreen extends Component{

    popToBack(){
        // this.props.navigation.goBack()
        this.props.navigator.pop();
    }

    render() {
        return (
            <View style={styles.container}>

                <BaseNavigationBar
                    title={'Banner详情'}
                    leftImageSource={require('../../../images/other/ic_back.png')}
                    leftItemFunc={() => this.popToBack()}/>

                <View style={{ flex:1}}>
                    <WkWebView style={{ backgroundColor: 'white',width:width }}
                               contentInsetAdjustmentBehavior="always"
                               userAgent="MyFancyWebView"
                               hideKeyboardAccessoryView={false}
                               ref={(c) => this.webview = c}
                               sendCookies={true}
                               source={{ uri: 'http://news.baidu.com' }}
                               onMessage={(e) => console.log(e.nativeEvent)}
                               injectedJavaScript="window.postMessage('Hello from JavaScript'); document.addEventListener('message', e => { alert(e.data); });"
                    />
                    <Text style={{ fontWeight: 'bold', padding: 10 }} onPress={() => this.webview.reload()}>刷新</Text>
                    <Text style={{ fontWeight: 'bold', padding: 10 }} onPress={() => this.webview.postMessage("Hello from React Native")}>传递消息</Text>
                </View>

            </View>
        );
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1
    }
});
